<template>
  <el-dialog
    v-dialogDrag
    :visible.sync="dialogVisible"
    width="50%"
    :before-close="handleClose"
    :close-on-click-modal="false"
  >
    <div>
      <el-divider content-position="left">数据标准化</el-divider>
      <el-form ref="form" label-width="100px">
        <el-form-item label="数据标准化">
          <el-select v-model="logicalform.defaultselect" placeholder="请选择处理方式" @change="handleChange">
            <el-option v-for="item in options" :key="item.value" :value="item.value" :label="item.label"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <el-divider content-position="left">基本选项</el-divider>
      <el-form :inline="true">
        <el-form-item label="正则化参数" label-width="100px">
          <el-input v-model="logicalform.para" placeholder="0 - x" @change="handlepara" />
        </el-form-item>
        <el-form-item label="最大迭代次数" label-width="100px">
          <el-input v-model="logicalform.iternum" placeholder="0 - x" @change="handleiternum"/>
        </el-form-item>
        <el-form-item label="收敛容差" label-width="100px">
          <el-input v-model="logicalform.errornum" placeholder="0 - x" @change="handleerrornum"/>
        </el-form-item>
        <el-form-item label="惩罚函数类型">
          <el-select v-model="logicalform.defaultselect1" placeholder="请选择类型" @change="handleChange1">
            <el-option v-for="item in options1" :key="item.value" :value="item.value" :label="item.label"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
    </div>
    <el-switch
      v-model="logicalform.value1"
      active-text="选择变量重要性"
      inactive-text="不选择变量重要性"
      @change="handleswitch"
    />
    <div align="end" class="div1">
      <el-button type="info" round @click="dialogVisible1 = true">点击查看功能说明</el-button>
    </div>
    <el-dialog
      v-dialogDrag
      title="提示"
      :visible.sync="dialogVisible1"
      width="30%"
      :before-close="handleClose"
      :close-on-click-modal="false"
      append-to-body
    >
      <span>幸福，时时刻刻围绕在你的周围：如果你与母亲逛街，心存温馨，那就是幸福；如果你在课堂上，在老师的指引下，遨游在知识海洋，那就是幸福；如果你在朦胧的灯光下，静静看书，凝神遐想，那就是幸福……

        假日，我陪母亲逛街。我喜欢稍后一步跟随着母亲，凭她老人家带着我在街巷左拐右折。母亲带我来到一家点心铺，从腰中掏出一张面额不小的钞票，非要我和那几个小孩坐在同一条长凳上吃点心。于是，我便擎着小碗加入了那几个小孩的行列，大嚼大咽起来。母亲则在一旁微笑着。陪母亲逛街，是件多么幸福的事啊！母亲怜爱我，纵宠我，不为别的，就因为我是她女儿。我眼中流动的是她昨日的眼神，我眉梢挑着的是她今日的骄矜。在母亲的心目中，我的一颦一笑一啄一饮都是天大的事。我拈起一片快乐的红叶，母亲便拥有整座枫林；我咽下一滴苦涩的海水，母亲便坠入了汪洋大海。拥有母亲，便拥有幸福。与母亲相伴，幸福的琼浆便汩汩流出。

        清晨，语文老师风风火火地走进了教室，他和蔼可亲，看着艾米丽的《呼啸山庄》。我喜欢看书，更喜欢看书给我带来的幸福。</span>
      <div style="float: right; margin-top: 10px; margin-bottom: 20px">
        <el-button @click="dialogVisible1 = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible1 = false">确 定</el-button>
      </div>
    </el-dialog>
    <div style="float: right; margin-top: 10px; margin-bottom: 20px">
      <el-button type="info" @click="handlereset">重置</el-button>
      <el-button @click="cancelMethod">取 消</el-button>
      <el-button type="primary" @click="StoreDataMethod">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: 'LogicalRegressionClassify',
  inject: ['root','flowchartId'],
  props: [
    'dialogVisible'
  ],
  data() {
    return {
      logicalform:{
        para: '',
        iternum: '',
        errornum: '',
        value1: false,
        defaultselect: '', //第一个select的默认选项
        defaultselect1: ''
      },
      outputInfo:{
        result:''
      },
      options: [
        {
          value: 'nodeal',
          label: '无处理'
        }, {
          value: 'normalized',
          label: '归一化'
        }, {
          value: 'standard',
          label: '标准化'
        }],//第一个select的option
      options1: [
        {
          value: 'L1',
          label: 'L1'
        }, {
          value: 'L2',
          label: 'L2'
        }, {
          value: 'L1+L2',
          label: 'L1+L2'
        }],
      dialogVisible1: false
    }
  },
  created() {
    console.log('逻辑回归初始化了')
    // 在session中读取上个节点的输出信息
    const { getSelected,save,find } = this.root.propsAPI
    const formModel = getSelected()[0].getModel()
    const graphData = save()
    const inEdges = graphData.edges.filter((edge) => {
      return edge.target === formModel.id
    })
    console.log(inEdges)
    // 如果图中没有配置上边的节点那么就不需要去session中去读去信息
    if(inEdges.length === 1){
      var inEdges_temp = inEdges[0]
      const inputModel = find(inEdges_temp.source).getModel()
      var keyname = inputModel.label+inputModel.id
      console.log('keyname:',keyname)
      var data = JSON.parse(sessionStorage.getItem(keyname))
      this.outputInfo.result = data.resultdata
    }
    // 保证关闭再打开之后仍然存储之前配置的信息
    var keyName = formModel.label+formModel.id
    var data = JSON.parse(sessionStorage.getItem(keyName))
    if(data){
      this.logicalform.para = data.para
      this.logicalform.iternum = data.iternum
      this.logicalform.errornum = data.errornum
      this.logicalform.value1 = data.value1
      this.logicalform.defaultselect = data.defaultselect
      this.logicalform.defaultselect1 = data.defaultselect1
    }else{
      console.log('logical cerated get data error')
    }
  },
  methods: {
    cancelMethod() {
      this.$emit('close-dialog')
    },
    StoreDataMethod() {
      this.$emit('close-dialog')
      const { getSelected } = this.root.propsAPI
      const formModel = getSelected()[0].getModel()
      var keyName = formModel.label+formModel.id
      sessionStorage.setItem(keyName,JSON.stringify(this.logicalform))
      var keyName1 = formModel.label+formModel.id+'outputInfo'
      sessionStorage.setItem(keyName1,JSON.stringify(this.outputInfo))
    },
    handlereset(){
      this.logicalform.para = ''
      this.logicalform.iternum = ''
      this.logicalform.errornum = ''
      this.logicalform.value1 = false
      this.logicalform.defaultselect = ''
      this.logicalform.defaultselect1 = ''
    },
    handleClose(done) {
      this.$confirm('确认关闭？')
        .then((_) => {
          done()
        })
        .catch((_) => {
        })
    },
    handleChange(val) {
      this.logicalform.defaultselect = val
    },
    handleChange1(val) {
      this.logicalform.defaultselect1 = val
    },
    handlepara(val){
      this.logicalform.para = val
    },
    handleiternum(val){
      this.logicalform.iternum = val
    },
    handleerrornum(val){
      this.logicalform.errornum = val
    },
    handleswitch(val){
      this.logicalform.value1 = val
    }
  }

}
</script>
<style>
  .div1 {
    padding: 10px;
  }

  .div2 {
    margin-right: 10px;
  }

  .clearfix:before,
  .clearfix:after {
    display: table;
    content: "";
  }

  .clearfix:after {
    clear: both;
  }
</style>
